<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="cp" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>商品详情</title>

    <link href="${cp}/css/bootstrap.min.css" rel="stylesheet">
    <link href="${cp}/css/style.css" rel="stylesheet">
    <script src="${cp}/js/jquery.min.js" type="text/javascript"></script>
    <script src="${cp}/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="${cp}/js/layer.js" type="text/javascript"></script>
  </head>
  <body>
    <!--导航栏部分-->
    <jsp:include page="include/header.jsp"/>

    <!-- 中间内容 -->
    <div class="container-fluid">
        <div class="row">
          <div class="col-sm-1 col-md-1"></div>
          <div class="col-sm-10 col-md-10">
            <h1>${showProduct.pname}</h1>
            <hr/>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-1 col-md-1"></div>
          <div class="col-sm-5 col-md-5">
            <img class="detail-img" src="${cp}/static/${showProduct.image}" style="width: 650px; height: 400px;">
          </div>
          <div class="col-sm-5 col-md-5 detail-x">
            <table class="table table-striped">
              <tr>
                <th>商品名称</th>
                <td>${showProduct.pname}</td>
              </tr>
              <tr>
                <th>商品价格</th>
                <td>${showProduct.price}</td>
              </tr>
              <tr>
                <th>商品描述</th>
                <td>${showProduct.describe}</td>
              </tr>
              <tr>
                <th>库存</th>
                <td>${showProduct.counts}</td>
              </tr>
              <tr>
                <th>购买数量</th>
                <td>
                    <form action="#">
                      <input type="number" class="number" id="numeric" min="1" value="1" style="width: 100px; text-align: center;">
                    </form>
                </td>
              </tr>
            </table>
            <div class="row">
              <div class="col-sm-1 col-md-1 col-lg-1"></div>
              <button class="btn btn-danger btn-lg col-sm-4 col-md-4 col-lg-4">
                <dt>
                  <a id="addbtn" href="${cp}/cart/addCart.do?pid=${showProduct.pid}&quantity=" onclick="document.getElementById('addbtn').href+=document.getElementById('numeric').value;">添加购物车</a>
                </dt>

              </button>
              <div class="col-sm-2 col-md-2 col-lg-2"></div>
              <button  class="btn btn-danger btn-lg col-sm-4 col-md-4 col-lg-4" onclick="buyConfirm(${showProduct.pid})">购买</button>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-1 col-md-1 col-lg-1"></div>
          <div class="col-sm-10 col-md-10 col-lg-10">
            <hr class="division"/>
            <table class="table evaluationTable" border="0" id="evaluation">
            </table>
            <hr/>
            <div id="inputArea"></div>
          </div>
        </div>
    </div>
    <!-- 尾部 -->
    <jsp:include page="include/foot.jsp"/>
  </body>

</html>